<template>
  <t-popup trigger="click" placement="bottom" showArrow>
    <t-button variant="outline">
      {{ data.remarks ? data.remarks : plugin.t('order.remarks') }}
    </t-button>
    <template #content>
      <div style="width: 200px;padding:10px 0;overflow: hidden">
        <t-select
          v-model="data.remarks"
          creatable
          filterable
          :options="options"
        />
      </div>
    </template>
  </t-popup>
</template>
<script setup>
  import { ref } from 'vue'
  import store from './store'
  import index from '../../index'
  import configStore from '@/plugin/config/store'

  const plugin = index.plugin
  const data = store.data

  const options = configStore.orderRemarks().map(item => {
    return {
      label: item, 
      value: item
    }
  })
</script>